<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp"%>
<!DOCTYPE HTML>
<html>
	<head>
		<title>菜单树形列表 - 用户中心</title>
		<%@ include file="/common/include/title.jsp"%>
		<link rel="stylesheet" href="${rootPath }/common/resource/H-ui.admin/lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
		<meta name="keywords" content="用户中心-登录">
		<meta name="description" content="用户中心-登录">
		</head>
	<body>
		<nav class="breadcrumb">
			<i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span>
			产品管理 <span class="c-gray en">&gt;</span> 产品分类 <a
				class="btn btn-success radius r"
				style="line-height: 1.6em; margin-top: 3px"
				href="javascript:location.replace(location.href);" title="刷新"><i
				class="Hui-iconfont">&#xe68f;</i></a>
		</nav>
		<table class="table">
			<tr>
				<td width="200" class="va-t"><ul id="treeDemo" class="ztree"></ul></td>
			</tr>
			<c:if test="${param.roleId != null && param.roleId != ''}">
				<tr>
					<td colspan="2" align="center">
						<span style="margin-left:20px">
							<a id="roleSubmit" class="btn btn-primary radius" data-title="提交" 
								href="${rootPath }/back/UsersBack/roleMenuSubmit&roleId=${param.roleId}">
								提交
							</a>
						</span>
					</td>
				</tr>
			</c:if>
		</table>
		<%@ include file="/common/include/footer.jsp" %>
		<!--请在下方写此页面业务相关的脚本-->
		<script type="text/javascript" src="${rootPath }/common/resource/H-ui.admin/lib/zTree/v3/js/jquery.ztree.all-3.5.min.js"></script>
		<script type="text/javascript">
			var setting = {
				view : {
					dblClickExpand : true,
					showLine : true,
					selectedMulti : false
				},
				<c:if test="${param.roleId != null && param.roleId != ''}">
				check: {
					enable: true
				},
				</c:if>
				data : {
					simpleData : {
						enable : true,
						/* 主键 */
						idKey : "id",
						/* 上一级 */
						pIdKey : "pid",
						/* 根节点 */
						rootPId : ""
					}
				},
				callback : {
					beforeClick : function(treeId, treeNode) {
						var zTree = $.fn.zTree.getZTreeObj("tree");
						if (treeNode.isParent) {
							zTree.expandNode(treeNode);
							return false;
						} else {
							demoIframe.attr("src", treeNode.file + ".html");
							return true;
						}
					}
				}
			};
	
			var zNodes = ${requestScope.menuTreeJson};
	
			var code;
	
			function showCode(str) {
				if (!code)
					code = $("#code");
				code.empty();
				code.append("<li>" + str + "</li>");
			}
	
			$(document).ready(function() {
				var t = $("#treeDemo");
				t = $.fn.zTree.init(t, setting, zNodes);
				demoIframe = $("#testIframe");
				//demoIframe.on("load", loadReady);
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				$("#roleSubmit").click(function(){
					var checkNodes = zTree.getCheckedNodes(true);
					var ids = "&ids=";
					for(var i = 0 ; i < checkNodes.length; i ++) {
						var checkTemp = checkNodes[i];
						ids = ids + checkTemp.id + ",";
					}
					console.debug("ids===",ids)
					/* 获取原来的href */
					var hrefSou = $(this).attr("href");
					/* 追加ids */
					hrefSou += ids;
					$(this).attr("href", hrefSou);
					return true;
				});
			});
		</script>
	</body>
</html>